<form nz-form #validateForm="ngForm" (ngSubmit)="saveAll()" autocomplete="off">
    <nz-tabset *ngIf="settings" [nzTabBarExtraContent]="extraTemplate">
        <nz-tab [nzTitle]="l('General')" *ngIf="showTimezoneSelection">
            <nz-card [nzBordered]="false">
                <nz-form-item nz-row>
                    <nz-form-label nzFor="Timezone">
                        {{"Timezone" | localize}}
                    </nz-form-label>
                    <nz-form-control>
                        <timezone-combo id="Timezone" [(selectedTimeZone)]="settings.general.timezone"
                            defaultTimezoneScope="{{defaultTimezoneScope}}"></timezone-combo>
                    </nz-form-control>
                </nz-form-item>
            </nz-card>
        </nz-tab>
        <nz-tab [nzTitle]="l('UserManagement')" *ngIf="true">
            <nz-card [nzBordered]="false">
                <h3>{{"FormBasedRegistration" | localize}}</h3>
                <nz-form-item nz-row>
                    <div nz-col><label nz-checkbox name="AllowSelfRegistration" [(ngModel)]="settings.userManagement.allowSelfRegistration">{{"AllowUsersToRegisterThemselves" | localize}}</label></div>
                    <nz-form-extra>{{"AllowUsersToRegisterThemselves_Hint" | localize}}</nz-form-extra>
                </nz-form-item>
                <nz-form-item nz-row>
                    <div nz-col><label nz-checkbox name="IsNewRegisteredUserActiveByDefault" [(ngModel)]="settings.userManagement.isNewRegisteredUserActiveByDefault">{{"NewRegisteredUsersIsActiveByDefault" | localize}}</label></div>
                    <nz-form-extra>{{"NewRegisteredUsersIsActiveByDefault_Hint" | localize}}</nz-form-extra>
                </nz-form-item>
                <div *ngIf="!isMultiTenancyEnabled && settings.ldap.isModuleEnabled">
                    <h3 class="">{{"LdapSettings" | localize}}</h3>
                    <nz-form-item nz-row>
                        <div nz-col><label nz-checkbox name="LdapIsEnabled" [(ngModel)]="settings.ldap.isEnabled">{{"EnableLdapAuthentication" | localize}}</label></div>
                        <nz-form-extra>{{"EnableLdapAuthentication" | localize}}</nz-form-extra>
                    </nz-form-item>
                    <nz-form-item nz-row *ngIf="!settings.ldap.isEnabled">
                        <nz-form-label nzFor="LdapDomainName">
                            {{"DomainName" | localize}}
                        </nz-form-label>
                        <nz-form-control nzHasFeedback>
                            <input nz-input #ldapDomainNameInput="ngModel" name="LdapDomainName" [(ngModel)]="settings.ldap.domain"
                                placeholder="{{'DomainName' | localize}}" id="LdapDomainName" maxlength="128">
                            <nz-form-explain *ngIf="ldapDomainNameInput.dirty && ldapDomainNameInput.errors">
                                <validation-messages [formCtrl]="ldapDomainNameInput"></validation-messages>
                            </nz-form-explain>
                        </nz-form-control>
                    </nz-form-item>
                    <nz-form-item nz-row *ngIf="!settings.ldap.isEnabled">
                        <nz-form-label nzFor="LdapUserName">
                            {{"UserName" | localize}}
                        </nz-form-label>
                        <nz-form-control nzHasFeedback>
                            <input nz-input #ldapUserNameInput="ngModel" name="LdapUserName" [(ngModel)]="settings.ldap.userName"
                                placeholder="{{'UserName' | localize}}" id="LdapUserName" maxlength="128">
                            <nz-form-explain *ngIf="ldapUserNameInput.dirty && ldapUserNameInput.errors">
                                <validation-messages [formCtrl]="ldapUserNameInput"></validation-messages>
                            </nz-form-explain>
                        </nz-form-control>
                    </nz-form-item>
                    <nz-form-item nz-row *ngIf="!settings.ldap.isEnabled">
                        <nz-form-label nzFor="LdapPassword">
                            {{"Password" | localize}}
                        </nz-form-label>
                        <nz-form-control nzHasFeedback>
                            <input nz-input #ldapPasswordInput="ngModel" name="LdapPassword" [(ngModel)]="settings.ldap.password"
                                placeholder="{{'Password' | localize}}" id="LdapPassword" maxlength="128">
                            <nz-form-explain *ngIf="ldapPasswordInput.dirty && ldapPasswordInput.errors">
                                <validation-messages [formCtrl]="ldapPasswordInput"></validation-messages>
                            </nz-form-explain>
                        </nz-form-control>
                    </nz-form-item>
                </div>
                <div>
                    <h3>{{"OtherSettings" | localize}}</h3>
                    <div nz-row>
                        <label nz-checkbox name="IsEmailConfirmationRequiredForLogin" [(ngModel)]="settings.userManagement.isEmailConfirmationRequiredForLogin">{{"EmailConfirmationRequiredForLogin" | localize}}</label>
                    </div>
                </div>
            </nz-card>
        </nz-tab>
        <nz-tab [nzTitle]="l('Security')" *ngIf="true">
            <nz-card [nzBordered]="false">
                <h3>{{"PasswordComplexity" | localize}}</h3>
                <div nz-row>
                    <label nz-checkbox name="Setting_PasswordComplexity_UseDefaultSettings" [(ngModel)]="settings.security.useDefaultPasswordComplexitySettings">{{"UseDefaultSettings" | localize}}</label>
                </div>
                <div nz-row>
                    <label nz-checkbox name="Setting_PasswordComplexity_RequireDigit" [(ngModel)]="settings.security.passwordComplexity.requireDigit"
                        [nzDisabled]="settings.security.useDefaultPasswordComplexitySettings">{{"PasswordComplexity_RequireDigit" | localize}}</label>
                </div>
                <div nz-row>
                    <label nz-checkbox name="Setting_PasswordComplexity_RequireLowercase" [(ngModel)]="settings.security.passwordComplexity.requireLowercase"
                        [nzDisabled]="settings.security.useDefaultPasswordComplexitySettings">{{"PasswordComplexity_RequireLowercase" | localize}}</label>
                </div>
                <div nz-row>
                    <label nz-checkbox name="Setting_PasswordComplexity_RequireNonAlphanumeric" [(ngModel)]="settings.security.passwordComplexity.requireNonAlphanumeric"
                        [nzDisabled]="settings.security.useDefaultPasswordComplexitySettings">{{"PasswordComplexity_RequireNonAlphanumeric" | localize}}</label>
                </div>
                <div nz-row>
                    <label nz-checkbox name="Setting_PasswordComplexity_RequireUppercase" [(ngModel)]="settings.security.passwordComplexity.requireUppercase"
                        [nzDisabled]="settings.security.useDefaultPasswordComplexitySettings">{{"PasswordComplexity_RequireUppercase" | localize}}</label>
                </div>
                <div nz-row>
                    <label [ngClass]="{'text-disabled-color':settings.security.useDefaultPasswordComplexitySettings}">{{"PasswordComplexity_RequiredLength" | localize}}</label>
                    <input nz-input type="number" name="RequiredLength" class="form-control" [(ngModel)]="settings.security.passwordComplexity.requiredLength"
                        *ngIf="!settings.security.useDefaultPasswordComplexitySettings">
                    <input nz-input type="number" name="RequiredLength" class="form-control" [(ngModel)]="settings.security.defaultPasswordComplexity.requiredLength"
                        *ngIf="settings.security.useDefaultPasswordComplexitySettings" disabled>
                </div>
                <h3 class="mt-md">{{"UserLockOut" | localize}}</h3>
                <nz-form-item nz-row class="m0">
                    <label nz-checkbox name="Setting_UserLockOut_IsEnabled" [(ngModel)]="settings.security.userLockOut.isEnabled">{{"EnableUserAccountLockingOnFailedLoginAttemts" | localize}}</label>
                </nz-form-item>
                <nz-form-item nz-row class="m0" *ngIf="settings.security.userLockOut.isEnabled">
                    <nz-form-label nzFor="MaxFailedAccessAttemptsBeforeLockout">
                        {{"MaxFailedAccessAttemptsBeforeLockout" | localize}}
                    </nz-form-label>
                    <nz-form-control>
                        <input nz-input type="number" name="MaxFailedAccessAttemptsBeforeLockout" [(ngModel)]="settings.security.userLockOut.maxFailedAccessAttemptsBeforeLockout"
                            id="MaxFailedAccessAttemptsBeforeLockout">
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row class="m0" *ngIf="settings.security.userLockOut.isEnabled">
                    <nz-form-label nzFor="DefaultAccountLockoutSeconds">
                        {{"DefaultAccountLockoutDurationAsSeconds" | localize}}
                    </nz-form-label>
                    <nz-form-control>
                        <input nz-input type="number" name="DefaultAccountLockoutSeconds" [(ngModel)]="settings.security.userLockOut.defaultAccountLockoutSeconds"
                            id="DefaultAccountLockoutSeconds">
                    </nz-form-control>
                </nz-form-item>
                <div *ngIf="!isMultiTenancyEnabled || settings.security.twoFactorLogin.isEnabledForApplication">
                    <h3 class="mt-md">{{"TwoFactorLogin" | localize}}</h3>
                    <div nz-row>
                        <label nz-checkbox name="Setting_TwoFactorLogin_IsEnabled" [(ngModel)]="settings.security.twoFactorLogin.isEnabled">{{"EnableTwoFactorLogin" | localize}}</label>
                    </div>
                    <div nz-row *ngIf="settings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
                        <label nz-checkbox name="Setting_TwoFactorLogin_IsEmailProviderEnabled" [(ngModel)]="settings.security.twoFactorLogin.isEmailProviderEnabled">{{"IsEmailVerificationEnabled" | localize}}</label>
                    </div>
                    <div nz-row *ngIf="settings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
                        <label nz-checkbox name="Setting_TwoFactorLogin_IsSmsProviderEnabled" [(ngModel)]="settings.security.twoFactorLogin.isSmsProviderEnabled">{{"IsSmsVerificationEnabled" | localize}}</label>
                    </div>
                    <div nz-row *ngIf="settings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
                        <label nz-checkbox name="Setting_TwoFactorLogin_IsGoogleAuthenticatorEnabled" [(ngModel)]="settings.security.twoFactorLogin.isGoogleAuthenticatorEnabled">{{"IsGoogleAuthenticatorEnabled" | localize}}</label>
                    </div>
                    <div nz-row *ngIf="settings.security.twoFactorLogin.isEnabled && !isMultiTenancyEnabled">
                        <label nz-checkbox name="Setting_TwoFactorLogin_IsRememberBrowserEnabled" [(ngModel)]="settings.security.twoFactorLogin.isRememberBrowserEnabled">{{"AllowToRememberBrowserForTwoFactorLogin" | localize}}</label>
                    </div>
                </div>
            </nz-card>
        </nz-tab>
        <nz-tab [nzTitle]="l('EmailSmtp')" *ngIf="!isMultiTenancyEnabled">
            <nz-card [nzBordered]="false">
                <nz-form-item nz-row>
                    <nz-form-label nzFor="DefaultFromAddress">
                        {{"DefaultFromAddress" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input #defaultFromAddressInput="ngModel" name="DefaultFromAddress" [(ngModel)]="settings.email.defaultFromAddress"
                            id="DefaultFromAddress" email maxlength="128">
                        <nz-form-explain *ngIf="defaultFromAddressInput.dirty && defaultFromAddressInput.errors">
                            <validation-messages [formCtrl]="defaultFromAddressInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row>
                    <nz-form-label nzFor="DefaultFromDisplayName">
                        {{"DefaultFromDisplayName" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input #defaultFromDisplayNameInput="ngModel" name="DefaultFromDisplayName"
                            [(ngModel)]="settings.email.defaultFromDisplayName" id="DefaultFromDisplayName" maxlength="128">
                        <nz-form-explain *ngIf="defaultFromDisplayNameInput.dirty && defaultFromDisplayNameInput.errors">
                            <validation-messages [formCtrl]="defaultFromDisplayNameInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row>
                    <nz-form-label nzFor="SmtpHost">
                        {{"SmtpHost" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input #smtpHostInput="ngModel" name="SmtpHost" [(ngModel)]="settings.email.smtpHost"
                            id="SmtpHost" maxlength="64">
                        <nz-form-explain *ngIf="smtpHostInput.dirty && smtpHostInput.errors">
                            <validation-messages [formCtrl]="smtpHostInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row>
                    <nz-form-label nzFor="SmtpPort">
                        {{"SmtpPort" | localize}}
                    </nz-form-label>
                    <nz-form-control>
                        <input nz-input type="number" #smtpPortInput="ngModel" name="SmtpPort" [(ngModel)]="settings.email.smtpPort"
                            id="SmtpPort">
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row>
                    <div nz-col><label nz-checkbox name="SmtpEnableSsl" [(ngModel)]="settings.email.smtpEnableSsl">{{"UseSsl" | localize}}</label></div>
                </nz-form-item>
                <nz-form-item nz-row>
                    <div nz-col><label nz-checkbox name="SmtpUseDefaultCredentials" [(ngModel)]="settings.email.smtpUseDefaultCredentials">{{"UseDefaultCredentials" | localize}}</label></div>
                </nz-form-item>
                <nz-form-item nz-row [hidden]="settings.email.smtpUseDefaultCredentials">
                    <nz-form-label nzFor="SmtpDomainName">
                        {{"DomainName" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input #smtpDomainNameInput="ngModel" name="SmtpDomainName" [(ngModel)]="settings.email.smtpDomain"
                            id="SmtpDomainName" maxlength="128">
                        <nz-form-explain *ngIf="smtpDomainNameInput.dirty && smtpDomainNameInput.errors">
                            <validation-messages [formCtrl]="smtpDomainNameInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row [hidden]="settings.email.smtpUseDefaultCredentials">
                    <nz-form-label nzFor="SmtpUserName">
                        {{"UserName" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input #smtpUserNameInput="ngModel" name="SmtpUserName" [(ngModel)]="settings.email.smtpUserName"
                            id="SmtpUserName" maxlength="128">
                        <nz-form-explain *ngIf="smtpUserNameInput.dirty && smtpUserNameInput.errors">
                            <validation-messages [formCtrl]="smtpUserNameInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item nz-row [hidden]="settings.email.smtpUseDefaultCredentials">
                    <nz-form-label nzFor="SmtpPassword">
                        {{"Password" | localize}}
                    </nz-form-label>
                    <nz-form-control nzHasFeedback>
                        <input nz-input type="password" #smtpPasswordInput="ngModel" name="SmtpPassword" [(ngModel)]="settings.email.smtpPassword"
                            id="Password" maxlength="128">
                        <nz-form-explain *ngIf="smtpPasswordInput.dirty && smtpPasswordInput.errors">
                            <validation-messages [formCtrl]="smtpPasswordInput"></validation-messages>
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <hr />
                <h3>{{"TestEmailSettingsHeader" | localize}}</h3>
                <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
                    <input type="text" nz-input [(ngModel)]="testEmailAddress" name="TestEmailAddress">
                </nz-input-group>
                <ng-template #suffixButton>
                    <button nz-button nzType="primary" nzSearch (click)="sendTestEmail()">{{"SendTestEmail" | localize}}</button>
                </ng-template>
            </nz-card>
        </nz-tab>
    </nz-tabset>
    <ng-template #extraTemplate>
        <button nz-button [nzType]="'primary'" type="submit">
            <i nz-icon type="save"></i> {{"SaveAll" | localize}}
        </button>
    </ng-template>
</form>
